import { formatNum } from '@/utils';
import styles from './index.module.less';
import { Button } from 'antd';
import { EditOutlined } from '@ant-design/icons';

// 止盈弹框简介
export function Desc({ formData, contractList }: any) {
  return (
    <>
      <div className={`${styles.title} center-v`}>
        {formData?.contract} 永续 ·做{formData?.size > 0 ? '多' : '空'}·
        {formData?.leverage !== '0'
          ? `逐仓, ${formData?.leverage}x`
          : `全仓, ${formData?.cross_leverage_limit}x`}
      </div>
      <div className={`${styles.tllist} flex`}>
        <div className={`${styles.titem}`}>
          <div className={`${styles.tkey}`}>开仓均价</div>
          <div className={`${styles.tval}`}>{formData?.entry_price} USDT</div>
        </div>
        <div className={`${styles.titem}`}>
          <div className={`${styles.tkey}`}>标记价格</div>
          <div className={`${styles.tval}`}>
            {contractList && formatNum(contractList[formData?.contract]?.index_price)} USDT
          </div>
        </div>
        <div className={`${styles.titem}`}>
          <div className={`${styles.tkey}`}>预估强平价</div>
          <div className={`${styles.tval}`}>{formData?.qingPingJia} USDT</div>
        </div>
      </div>
    </>
  );
}

// 仓位止盈数量
export const ZhiYingDom = ({ record, type = 'all', zhiYingDomClick }: any) => {
  const { zhiYing, zhiSun } = record?.zhiYingSunData?.quanCang;
  const { max, min, duiZiList } = record?.zhiYingSunData?.buFenCang;
  return (
    <div className={`${styles.zhiYingTableWrap} center-v`}>
      {type === 'all' ? (
        // 全部仓位
        <>
          {!zhiYing ? (
            <div>
              <div>--</div>
              <div>--</div>
            </div>
          ) : (
            <div className={`${styles.tcon} center-v`}>
              <div>
                <div className={`${styles.titem} ${zhiYing && 'color-red'}`}>
                  {zhiYing ? zhiYing?.trigger?.price : '--'}
                </div>
                <div className={`${styles.titem} ${zhiSun && 'color-green'}`}>
                  {zhiSun ? zhiSun?.trigger?.price : '--'}
                </div>
              </div>
              {/* <div>
                <EditOutlined />
              </div> */}
            </div>
          )}
        </>
      ) : (
        // 部分仓位
        <>
          {!duiZiList || duiZiList?.length === 0 ? (
            <div>
              <div>--</div>
              <div>--</div>
            </div>
          ) : (
            <div className={`${styles.tcon} center-v`}>
              <div>
                <div className={`${styles.titem} ${max && 'color-red'}`}>{max ? max : '--'}</div>
                <div className={`${styles.titem} ${min && 'color-green'}`}>{min ? min : '--'}</div>
              </div>
              <div>
                ({duiZiList.length || 0}){/* <EditOutlined /> */}
              </div>
            </div>
          )}
        </>
      )}
    </div>
  );
};
